<template>
	<view class="shoping">
		<u-navbar :is-back="false" :background="background" height="240">
			<view class="slot-wrap">
				<view class="title">{{current==0?'商品管理':'运费模板管理'}}</view>
				<view class="navContent">
					<view class="navContent-item">
						<view class="navName" v-if="current==0">总商品数</view>
						<view class="navName" v-else>总运费模板</view>
						<view class="navNum">
							<u-count-to v-if="current==0" :start-val="0" :end-val="totalNum" color="white"
								font-size="30" bold></u-count-to>
							<u-count-to v-else :start-val="0" :end-val="T_totalNum" color="white" font-size="30" bold>
							</u-count-to>
							<text style="font-size: 24rpx;">{{current==0?'件':'条'}}</text>
						</view>
					</view>
					<view class="navContent-item">
						<view class="navName" v-if="current==0">已上架</view>
						<view class="navName" v-else>已开启</view>
						<view class="navNum">
							<u-count-to v-if="current==0" :start-val="0" :end-val="onlineNum" color="white"
								font-size="30" bold></u-count-to>
							<u-count-to v-else :start-val="0" :end-val="T_enableNum" color="white" font-size="30" bold>
							</u-count-to>
							<text style="font-size: 24rpx;">{{current==0?'件':'条'}}</text>
						</view>
					</view>
					<view class="navContent-item">
						<view class="navName" v-if="current==0">已下架</view>
						<view class="navName" v-else>已禁用</view>
						<view class="navNum">
							<u-count-to v-if="current==0" :start-val="0" :end-val="offlineNum" color="white"
								font-size="30" bold></u-count-to>
							<u-count-to v-else :start-val="0" :end-val="T_disableNum" color="white" font-size="30" bold>
							</u-count-to>
							<text style="font-size: 24rpx;">{{current==0?'件':'条'}}</text>
						</view>
					</view>
				</view>
			</view>
			<view style="width: 100%;position: absolute;bottom: 0;">
				<view class="search">
					<view class="searchBox">
						<u-search v-if="current==0" placeholder="搜索商家名称" v-model="form.product_name"
							:show-action="false" :clearabled="false">
						</u-search>
						<u-search v-else placeholder="搜索运费模板名称" v-model="transportForm.transName" :show-action="false"
							:clearabled="false">
						</u-search>
						<view class="searchBtn" @click="search()">搜索</view>
					</view>

					<view style="margin-left:30rpx;" v-show="current==0">
						<u-image :src="require('@/static/shoping/sx.png')" width="37rpx" height="37rpx" mode="aspectFit"
							@click="shuaixuan">
						</u-image>
					</view>
					<view style="margin-left:30rpx;">
						<u-image :src="current==0?require('@/static/shoping/add.png'):require('@/static/shoping/add2.png')"
							width="37rpx" height="37rpx" mode="aspectFit" @click="addMall()">
						</u-image>
					</view>
				</view>
				<u-tabs :bold="false" :list="list" :is-scroll="false" :current="current" @change="change"
					active-color="#3189EA"></u-tabs>
			</view>
		</u-navbar>
		<view v-show="current==0">
			<u-card box-shadow="0px 0px 24rpx 0px rgba(150, 150, 150, 0.17)" border-radius="8" padding="20"
				sub-title-color="#357CD4" sub-title-size="28" :border="false" class="card"
				v-for="(item,index) in goodsList" :key="index">
				<view slot="head" class="head">
					<view class="time">创建时间：{{item.createDate}}</view>
					<view class="active">{{PRODUCTSTATUS[item.productStatus]}}</view>
				</view>
				<view slot="body" class="body">
					<view class="body-item">
						<view class="title">
							<view class="left">
								<view>
									<u-image width="60rpx" height="60rpx" :src="item.productBrandLogo"></u-image>
								</view>
								<view style="margin-left: 5rpx;">{{item.productBrandName}}</view>
							</view>
							<view class="right">
								<u-image width="42rpx" height="42rpx"
									:src="item.productType==1?require('@/static/shoping/sw.png'):require('@/static/shoping/xy.png')">
								</u-image>
							</view>
						</view>
						<view class="goods">
							<view class="goods_img">
								<u-image :src="item.productMainImageUrl" width="100%" height="100%"></u-image>
							</view>
							<view class="goods_detail">
								<view style="color: #000000;">{{item.productName}}</view>
								<view>库存：{{item.totalStocks}} | 销量：{{item.soldUnit}}</view>
								<view>销售价格：<text style="color: #357CD4;">¥{{item.productSalePrice}}</text></view>
								<view>商品编码：{{item.productCode}}</view>
							</view>
						</view>
						<view class="goods_price">
							<view class="goods_price_item">
								<view class="goods_price_item_l">抵扣后价格:{{item.salePrice}}</view>
								<view class="goods_price_item_l">糖果抵扣率:{{item.sweetDeductRate}}%</view>
							</view>
							<view class="goods_price_item">
								<view class="goods_price_item_l">出售糖果数：{{item.saleSweet}}</view>
								<view class="goods_price_item_l">
									分类:{{item.topCategoryName}}>>{{item.productCategoryName}}</view>
							</view>
						</view>
						<view class="caozuo">
							<view>
								<u-image v-if="item.verifyMsg" src="@/static/shoping/zhong.png" width="34rpx"
									height="38rpx" @click="viewVerifyMsg(item.verifyMsg)"></u-image>
							</view>
							<view>
								<u-button class="u-m-l-20" type="primary" size="mini" plain shape="circle"
									v-show="item.productStatus==2||item.productStatus==1||item.productStatus==3||item.productStatus==0||item.productStatus==5||item.productStatus==4"
									@click="bianji(item)">
									{{item.productStatus==4?'查看详情':'编辑商品'}}
								</u-button>
								<u-button class="u-m-l-20" type="success" size="mini" plain shape="circle"
									v-show="item.productStatus==0||item.productStatus==3" @click="fabu(item)">发布商品
								</u-button>
								<u-button class="u-m-l-20" type="primary" size="mini" plain shape="circle"
									v-show="item.productStatus==1" @click="chexiao(item)">撤销商品</u-button>
								<u-button class="u-m-l-20" type="warning" size="mini" plain shape="circle"
									v-show="item.productStatus==4||item.productStatus==5||item.productStatus==2"
									@click="xiajia(item)">
									{{item.productStatus==4?'下架商品':item.productStatus==2?"下架商品":item.productStatus==5?'上架商品':''}}
								</u-button>
								<u-button class="u-m-l-20" type="error" size="mini" plain shape="circle"
									@click="mallDelete(item)">删除商品</u-button>
							</view>
						</view>
					</view>
				</view>
			</u-card>
			<view style="height: 80rpx;">
				<u-loadmore :status="status" />
			</view>
		</view>
		<view v-show="current==1">
			<u-card box-shadow="0px 0px 24rpx 0px rgba(150, 150, 150, 0.17)" border-radius="8" padding="20"
				sub-title-color="#357CD4" sub-title-size="28" :border="false" class="card"
				v-for="(item,index) in transportData" :key="index">
				<view slot="head" class="head" style="color: #77A9FD;">{{item.sellerName}}</view>
				<view slot="body" class="card_body">
					<view class="card_body_top u-margin-top-10">
						<view>模板名称：{{item.transName}}</view>
						<view style="color: #357CD4;">{{item.courierName}}</view>
					</view>
					<view class="card_body_middle u-margin-top-10">
						<view>计费方式：{{CHARGETYPE[item.chargeType]}}</view>
						<view class="displaytwo u-margin-top-10">
							<view>是否包邮：{{ISFREEFEE[item.isFreeFee]}}</view>
							<view>包邮金额：{{item.amount}}</view>
						</view>
						<view class="displaytwo u-margin-top-10">
							<view>首重(首件)价格：{{item.firstFee}}</view>
							<view>首重(首件)数量：{{item.firstPiece}}</view>
						</view>
						<view class="displaytwo u-margin-top-10">
							<view>续重(续件)价格：{{item.continuousFee}}</view>
							<view>续重(续件)数量：{{item.continuousPiece}}</view>
						</view>
					</view>
					<view class="card_body_top u-margin-top-20 u-margin-bottom-20">
						<view>
							<u-switch v-model="item.isActive" size="35"
								@change="switchChange(item.transportId,item.isActive)" inactive-color="#ccc"
								activeColor="#357CD4"></u-switch>
						</view>
						<view>
							<u-button type="primary" size="mini" plain shape="circle" @click="editYun(item.transportId)">编辑模板</u-button>
						</view>
					</view>
				</view>
			</u-card>
			<view style="height: 80rpx;">
				<u-loadmore :status="transportStatus" />
			</view>
		</view>
		<u-mask :show="show" :mask-click-able="false"
			style="display: flex;align-items: center;justify-content: center;">
			<view class="warp">
				<view class="rect">
					<view class="notice-header"></view>
					<view class="notice-content">
						<view class="notice-title">{{msg}}{{msg}}</view>
					</view>
					<view class="notice-footer">
						<u-button shape="circle" type="primary" class="noticeBtn" @click="lejie">我已了解</u-button>
					</view>
				</view>
			</view>
		</u-mask>

		<u-popup class="statusBarHeight" v-model="popupShow" mode="right" :safe-area-inset-bottom="true"
			border-radius="20" width="80%">
			<scroll-view scroll-y="true" :style="{height:height+'px'}">
				<view class="popupBody">
					<view class="Classification">
						<view class="title">商品类型</view>
						<view class="ClassificationBody">
							<u-row gutter="16">
								<u-col :span="4" v-for="(item,index) in PRODUCTTYPELIST" :key="index">
									<view class="itemBtn" :class="[index==productType?'active':'']"
										@click="productTypeClick(index,item.value)">{{item.label}}</view>
								</u-col>
							</u-row>
						</view>
					</view>
					
					<view class="popupBody">
						<view class="Classification">
							<view class="title">商品类别</view>
							<view class="ClassificationBody">
								<u-row gutter="16">
									<u-col :span="4" v-for="(item,index) in TYPEDATA" :key="index">
										<view class="itemBtn" :class="[index==type?'active':'']"
											@click="typeClick(index,item.value)">{{item.label}}</view>
									</u-col>
								</u-row>
							</view>
						</view>
					</view>
					<u-gap height="10" bg-color="#f2f2f2"></u-gap>
					<view class="Classification">
						<view class="title">查询类型</view>
						<view class="ClassificationBody">
							<u-row gutter="16">
								<u-col :span="4" v-for="(item,index) in QUERYTYPELIST" :key="index">
									<view class="itemBtn" :class="[index==queryType?'active':'']"
										@click="queryTypeClick(index,item.value)">{{item.label}}</view>
								</u-col>
							</u-row>
						</view>
					</view>
					<u-gap height="10" bg-color="#f2f2f2"></u-gap>
					<view class="Classification">
						<view class="title">排序类型</view>
						<view class="ClassificationBody">
							<u-row gutter="16">
								<u-col :span="4" v-for="(item,index) in SORTTYPELIST" :key="index">
									<view class="itemBtn" :class="[index==sortType?'active':'']"
										@click="sortTypeClick(index,item.value)">{{item.label}}</view>
								</u-col>
							</u-row>
						</view>
					</view>
					<u-gap height="10" bg-color="#f2f2f2"></u-gap>
					<view class="Classification">
						<view class="title">商品状态</view>
						<view class="ClassificationBody">
							<u-row gutter="16">
								<u-col :span="4" v-for="(item,index) in PRODUCTSTATUSLIST" :key="index">
									<view class="itemBtn" :class="[index==statusType?'active':'']"
										@click="statusTypeClick(index,item.value)">{{item.label}}</view>
								</u-col>
							</u-row>
						</view>
					</view>
					<u-gap height="10" bg-color="#f2f2f2"></u-gap>
					<view class="Classification">
						<view class="title">商品编码</view>
						<view class="ClassificationBody" style="padding-bottom:30rpx;">
							<u-row gutter="16">
								<u-col :span="12">
									<input class="productCodeBtn" style="border: 1px solid #ccc;" type="text"
										v-model="form.product_code" placeholder="请输入商品编码" @input="search()" />
								</u-col>
							</u-row>
						</view>
					</view>
					<u-gap height="10" bg-color="#f2f2f2"></u-gap>
					<view class="Classification">
						<view class="title">品牌</view>
						<view class="ClassificationBody" style="padding-bottom:30rpx;">
							<u-row gutter="16">
								<u-col :span="4" v-for="(item,index) in BRANDLIST" :key="index" v-if="index<10">
									<view class="itemBtn" :class="[item.id==brandType?'active':'']"
										@click="brandTypeClick(item.id,item.id)">
										<view class="u-line-1" style="font-size: 12px;padding:0 12rpx;">
											{{item.brandTitle}}
										</view>
									</view>
								</u-col>
								<u-col :span="4">
									<view class="itemBtn" @click="quanbu()">
										<view style="font-size: 12px;padding:0 12rpx;" class="u-line-1">全部品牌</view>
									</view>
								</u-col>
							</u-row>
						</view>
					</view>
					<u-gap height="10" bg-color="#f2f2f2"></u-gap>
					<view class="Classification">
						<view class="title">商品分类</view>
						<view class="ClassificationBody">
							<u-row gutter="16">
								<u-col :span="12" style="padding-bottom:15px;">
									<u-input v-model="categoryName" type="select" border @click="categoryShow = true"
										placeholder="请选择商品分类" />
								</u-col>
							</u-row>
						</view>
					</view>
					<u-gap height="10" bg-color="#f2f2f2"></u-gap>
				</view>
			</scroll-view>

			<view class="popupFooter">
				<view class="btnbg">
					<view class="btnbg-item" style="color: #0094ff;" @click="reset()">重置</view>
					<view class="btnbg-item" style="color: white;" @click="confirm()">确定<text
							style="font-size: 24rpx;">({{total>999999?'10万+':total}}件商品)</text></view>
				</view>
			</view>
		</u-popup>

		<u-select v-model="bandListShow" :list="BRANDLIST" value-name="id" label-name="brandTitle"
			@confirm="brandConfirm"></u-select>

		<u-select v-model="categoryShow" :list="categoryList" @confirm="categoryConfirm" value-name="id"
			label-name="name"></u-select>
		<u-toast ref="uToast" />
		<u-modal v-model="modalShow" :zoom="false" :content='content' :show-title="false" :show-cancel-button="true"
			confirm-text="确定" cancel-text="取消" confirm-color="#357CD4" @confirm="productConfirm()"></u-modal>
	</view>
</template>
<script>
	export default {
		data() {
			return {
				totalNum: 0,
				onlineNum: 0,
				offlineNum: 0,
				T_disableNum: 0,
				T_enableNum: 0,
				T_totalNum: 0,
				modalShow: false,
				content: '',
				delId: '',
				form: {
					product_name: '', //商品名称
					product_code: '', //商品编码
					product_type: '', //商品类型
					query_type: '', //查询类型
					sort_type: '', //排序
					product_status: '', //状态
					product_brand_id: '', //品牌
					product_category_id: '', //商品分类id
					top_category_id: '', //一级分类
					secondary_category_id: '' ,//二级分类
					type: 0 // 商品类别
				},
				background: {
					background: "url("+require('@/static/distribution/bg.png')+")",
					backgroundRepeat:'no-repeat',
					backgroundSize: 'cover'
				},
				keyword: '',
				list: [{
					name: '商品列表'
				}, {
					name: '运费模板'
				}],
				current: 0,
				checked: true,
				goodsList: [],
				PRODUCTSTATUS: {
					0: '编辑',
					1: '待审核',
					2: '审核通过',
					3: '审核不通过',
					4: '上架',
					5: '下架',
					6: '删除'
				},
				show: false,
				msg: '',
				page: 1,
				size: 10,
				total: 0,
				status: 'loadmore',
				transportStatus: 'loadmore',
				popupShow: false,
				PRODUCTTYPELIST: [{
					value: '1',
					label: '实物商品'
				}, {
					value: '2',
					label: '虚拟商品'
				}],
				QUERYTYPELIST: [{
					value: '0',
					label: '更新时间'
				}, {
					value: '1',
					label: '综合'
				}, {
					value: '2',
					label: '价格'
				}, {
					value: '3',
					label: '销量'
				}],
				SORTTYPELIST: [{
					value: '1',
					label: '正序'
				}, {
					value: '2',
					label: '倒序'
				}],
				PRODUCTSTATUSLIST: [{
					value: '-1',
					label: '全部'
				}, {
					value: '0',
					label: '编辑'
				}, {
					value: '1',
					label: '待审核'
				}, {
					value: '2',
					label: '审核通过'
				}, {
					value: '3',
					label: '审核不通过'
				}, {
					value: '4',
					label: '上架'
				}, {
					value: '5',
					label: '下架'
				}, {
					value: '6',
					label: '删除'
				}],
				BRANDLIST: [],
				statusType: 0,
				sortType: 0,
				queryType: 0,
				productType: 0,
				brandType: null,
				bandListShow: false,
				categoryShow: false,
				height: 0,
				categoryList: [],
				categoryName: '',

				//运费模板
				transportForm: {
					page: 1,
					size: 10,
					merchantId: uni.getStorageSync('mid'), //商家ID
					transName: '', //模板名称
				},
				transportTotal: 0,
				transportData: [],
				CHARGETYPE: {
					0: '按件数计费',
					1: '按重量计费'
				},
				ISFREEFEE: {
					'false': '不包邮',
					'true': '包邮'
				},
				TYPEDATA: [
					{
						value: '0',
						label: '普通商品'
					},
					{
						value: '1',
						label: '文娱充值'
					},
					{
						value: '2',
						label: '话费充值'
					},
					{
						value: '3',
						label: '免单商品'
					}
				],
				type: 0,
			}
		},
		onReady() {
			var _this = this;
			uni.getSystemInfo({
				success: function(res) {
					let height = res.windowHeight;
					//#ifdef APP-PLUS
					_this.height = height - 100;
					//#endif
					//#ifdef H5
					_this.height = height;
					//#endif
				}
			})
		},
		mounted() {
			this.getGoodsList();
			this.getBrand();
			this.getCategory();
			this.getStatistics();
			//运费
			this.getTransportData();
			this.getTransportStatistics();
		},
		onPullDownRefresh() {
			this.shuaxin();
		},
		onReachBottom() {
			if (this.current == 0) {
				if (this.goodsList.length >= this.total) {
					this.status = 'nomore'
					return;
				}
				this.status = 'loading';
				this.page++;
				this.getGoodsList();
				setTimeout(() => {
					if (this.goodsList.length >= this.total) this.status = 'nomore';
					else this.status = 'loading';
				}, 2000)
			} else {
				if (this.transportData.length >= this.transportTotal) {
					this.transportStatus = 'nomore'
					return;
				}
				this.transportStatus = 'loading';
				this.transportForm.page++;
				this.getTransportData();
				setTimeout(() => {
					if (this.transportData.length >= this.transportTotal) this.transportStatus = 'nomore';
					else this.transportStatus = 'loading';
				}, 2000)
			}

		},
		methods: {
			editYun(id) {
				uni.navigateTo({
					url:`/pages/line/shoping/addShippingTemplate?id=${id}`,
					animationType:"slide-in-right"
				})
			},
			//商品统计
			getStatistics(){
				this.$u.api.productStatistics({
					mid: uni.getStorageSync('mid')
				}).then(res=>{
					if(res.code == 0){
						this.totalNum = res.data.totalNum;
						this.onlineNum = res.data.onlineNum;
						this.offlineNum = res.data.offlineNum;
						console.log(res.data);
					}
				})
			},
			shuaxin() {
				if (this.current == 0) {
					this.form = {
						product_name: '', //商品名称
						product_code: '', //商品编码
						product_type: '', //商品类型
						query_type: '', //查询类型
						sort_type: '', //排序类型
						product_status: '', //商品状态
						product_brand_id: '', //品牌ID
					};
					this.goodsList = [];
					this.page = 1;
					this.getGoodsList();
				} else {
					this.transportForm = {
						page: 1,
						size: 10,
						merchantId: uni.getStorageSync('mid'), //商家ID
						transName: '', //模板名称
					};
					this.getTransportData();
				}
			},
			//运费模板统计
			getTransportStatistics() {
				this.$u.api.transportStatistics({
					merchantId: uni.getStorageSync('mid')
				}).then(res => {
					if (res.code == 0) {
						this.T_disableNum = res.data.disableNum; //已禁用数量
						this.T_enableNum = res.data.enableNum; //已启用数量
						this.T_totalNum = res.data.totalNum; //运费模板总数
					}
				})
			},
			//发布
			fabu(item) {
				uni.navigateTo({
					url: '/pages/line/shoping/publishGoods?id=' + item.id
				})
			},
			//刷新页面
			refreshPage() {
				this.page = 1;
				this.goodsList = []
				this.getGoodsList();
			},
			//撤销
			chexiao(item) {
				this.$u.api.productUndoPut({
					id: item.id
				}).then(res => {
					if (res.code == 0) {
						this.$refs.uToast.show({
							title: '撤销成功',
							type: 'success',
							icon: true
						});
						this.goodsList = [];
						this.getGoodsList();
					} else {
						this.$refs.uToast.show({
							title: '撤销失败' + res.msg,
							type: 'success',
							icon: true
						});
					}
				})
			},
			//上架/下架
			xiajia(row) {
				let product_status = (row.productStatus == 4 || row.productStatus == 2) ? 5 : row.productStatus == 5 ? 4 :
					'';
				let name = (row.productStatus == 4 || row.productStatus == 2) ? '下架' : row.productStatus == 5 ? '上架' : '';
				this.$u.api.productXiajia({
					id: row.id,
					productStatus: product_status
				}).then(res => {
					if (res.code == 0) {
						this.$refs.uToast.show({
							title: name + '成功！',
							type: 'success',
							icon: true
						});
						this.goodsList = [];
						this.getGoodsList();
					} else {
						this.$refs.uToast.show({
							title: name + '失败！' + res.msg,
							type: 'success',
							icon: true
						});
					}
				})
			},
			//删除
			mallDelete(item) {
				this.content = '是否确定删除该商品？';
				this.modalShow = true;
				this.delId = item.id;
			},
			productConfirm() {
				this.$u.api.deleteProduct({
					id: this.delId
				}).then(res => {
					if (res.code == 0) {
						this.$refs.uToast.show({
							title: '删除成功',
							type: 'success',
							icon: true
						});
						this.goodsList = [];
						this.getGoodsList();
					} else {
						this.$refs.uToast.show({
							title: '删除失败' + res.msg,
							type: 'success',
							icon: true
						});
					}
				})
			},
			getBrand() {
				this.$u.api.brandList({
					mid: uni.getStorageSync('mid')
				}).then(res => {
					if (res.code == 0) {
						this.BRANDLIST = res.data;
					}
				})
			},
			getCategory() {
				this.$u.api.categoryList({
					mid: uni.getStorageSync('mid')
				}).then(res => {
					if (res.code == 0) {
						this.categoryList = res.data;
					}
				})
			},
			getGoodsList() {
				this.$u.api.getGoodsList({
					mid: uni.getStorageSync('mid'),
					page: this.page,
					size: this.size,
					product_name: this.form.product_name,
					product_code: this.form.product_code,
					product_type: this.form.product_type,
					query_type: this.form.query_type,
					sort_type: this.form.sort_type,
					product_status: this.form.product_status,
					product_brand_id: this.form.product_brand_id,
					product_category_id: this.form.product_category_id, //商品分类id
					top_category_id: this.form.top_category_id, //一级分类
					secondary_category_id: this.form.secondary_category_id ,//二级分类
					type: this.form.type
				}).then(res => {
					if (res.code == 0) {
						this.goodsList = [...this.goodsList, ...res.data];
						this.total = res.extraInfo;
						if (res.extraInfo < 10) {
							this.status = 'nomore'
						}
					}
				})
			},
			change(index) {
				this.current = index;
			},
			viewVerifyMsg(msg) {
				this.msg = msg;
				this.show = true;
			},
			lejie() {
				this.show = false;
			},
			search() {
				if (this.current == 0) {
					this.page = 1;
					this.goodsList = []
					this.getGoodsList();
				} else {
					this.transportForm.page = 1;
					this.transportData = [];
					this.getTransportData();
				}

			},
			shuaixuan() {
				this.popupShow = true;
			},
			typeClick(index, val) {
				if (this.type == index) return
				this.type = index;
				this.form.type = val;
				this.search();
			},
			productTypeClick(index, val) {
				if (this.productType == index) return
				this.productType = index;
				this.form.product_type = val;
				this.search();
			},
			queryTypeClick(index, val) {
				if (this.queryType == index) return
				this.queryType = index;
				this.form.query_type = val;
				this.search();
			},
			sortTypeClick(index, val) {
				if (this.sortType == index) return
				this.sortType = index;
				this.form.sort_type = val;
				this.search();
			},
			statusTypeClick(index, val) {
				if (this.statusType == index) return
				this.statusType = index;
				this.form.product_status = val;
				this.search();
			},
			brandTypeClick(index, val) {
				if (this.brandType == index) return
				this.brandType = index;
				this.form.product_brand_id = val;
				this.search();
			},
			//确定搜索
			confirm() {
				this.popupShow = false;
			},
			//重置
			reset() {
				this.form = {
					product_name: '', //商品名称
					product_code: '', //商品编码
					product_type: '', //商品类型
					query_type: '', //查询类型
					sort_type: '', //排序类型
					product_status: '', //商品状态
					product_brand_id: '', //品牌ID
					product_category_id: '', //商品分类id
					top_category_id: '', //一级分类
					secondary_category_id: '', //二级分类
					type: 0
				};
				this.statusType = 0;
				this.sortType = 0;
				this.queryType = 0;
				this.productType = 0;
				this.brandType = null;
				this.categoryName = '';
				this.type = 0
				this.search();
			},
			quanbu() {
				this.brandType = null;
				this.form.product_brand_id = '';
				this.bandListShow = true;
			},
			brandConfirm(e) {
				this.brandType = e[0].value;
				this.form.product_brand_id = e[0].value;
				this.search();
			},
			categoryConfirm(e) {
				this.form.product_category_id = e[0] ? e[0].value : ''; //一级分类
				this.form.top_category_id = e[1] ? e[1].value : ''; //二级分类
				this.form.secondary_category_id = e[2] ? e[2].value : ''; //三级分类
				this.categoryName = e[0].label
				this.search();
			},



			//运费模板相关
			getTransportData() {
				this.$u.api.transportList(this.transportForm).then(res => {
					if (res.code == 0) {
						this.transportData = [...this.transportData,...res.data];
						this.transportTotal = res.extraInfo;
						if (res.extraInfo < 10) {
							this.transportStatus = 'nomore'
						}
					}
				})
			},
			//运费模板开/关
			switchChange(transportId, isActive) {
				this.$u.api.transportUnload({
					isActive: isActive,
					transportId: transportId
				}).then(res => {
					if (res.code == 0) {
						this.$refs.uToast.show({
							title: '设置成功',
							// 如果不传此type参数，默认为default，也可以手动写上 type: 'default'
							type: 'success',
							// 如果不需要图标，请设置为false
							icon: true
						});
					}
				})

			},

			addMall() {
				if (this.current == 0) {
					uni.navigateTo({
						url: '/pages/line/shoping/addingGoods',
						animationType: "slide-in-right"
					})
				} else {
					uni.navigateTo({
						url: '/pages/line/shoping/addShippingTemplate',
						animationType: "slide-in-right"
					})
				}
			},
			bianji(item) {
				uni.navigateTo({
					url: '/pages/line/shoping/addingGoods?id=' + item.id,
					animationType: "slide-in-right"
				})
			},
		}
	}
</script>
<style scoped lang="scss">
	.statusBarHeight {
		margin-top: var(--status-bar-height);
	}

	.shoping {
		.slot-wrap {
			display: flex;
			flex-direction: column;
			justify-content: center;
			flex: 1;
			align-items: center;

			.title {
				color: white;
				font-size: 32rpx;
				font-weight: 700;
				padding-bottom: 30px;
			}

			.navContent {
				display: flex;
				align-items: center;
				justify-content: space-around;
				width: 100%;
				color: white;
				font-size: 30rpx;
				margin-bottom: 80px;

				.navContent-item {
					text-align: center;

					.navName {
						padding-bottom: 30rpx;
					}

					.navNum {
						font-weight: bold;
					}
				}
			}
		}

		.search {
			width: 100%;
			background-color: #77A9FD;
			height: 94rpx;
			display: flex;
			align-items: center;
			padding: 0 30rpx;

			.searchBox {
				background-color: #EEEEEE;
				display: flex;
				align-items: center;
				border-radius: 30rpx;
				flex: 1;

				.searchBtn {
					width: 99rpx;
					height: 56rpx;
					background-color: #357CD4;
					border-radius: 28rpx;
					display: flex;
					align-items: center;
					justify-content: center;
					color: white;
					margin-right: 4rpx;
				}
			}
		}

		.card {
			.head {
				display: flex;
				align-items: center;
				justify-content: space-between;

				.time {
					font-weight: bold;
				}

				.active {
					color: #357CD4;
				}
			}

			.body {
				.body-item {
					.title {
						display: flex;
						align-items: center;
						justify-content: space-between;
						margin-bottom: 20rpx;

						.left {
							display: flex;
							align-items: center;
							font-size: 28rpx;
						}
					}

					.goods {
						display: flex;
						border-bottom: 1px solid #C8C8C8;
						padding-bottom: 23rpx;

						.goods_img {
							width: 160rpx;
							height: 160rpx;
							border-radius: 10rpx;
							overflow: hidden;
							margin-right: 20rpx;
						}

						.goods_detail {
							font-size: 28rpx;
							color: #999999;
						}
					}

					.goods_price {
						display: flex;
						justify-content: space-between;
						color: #969696;
						padding: 20rpx 0;

						.goods_price_item {
							.goods_price_item_l {
								padding: 4rpx 0;
							}
						}
					}

					.caozuo {
						display: flex;
						align-items: center;
						justify-content: space-between;
						margin: 20rpx 0;

						.btnMiddle {
							margin: 0 20rpx;
						}
					}
				}
			}
		}

		.card_body_top,
		.displaytwo {
			display: flex;
			align-items: center;
			justify-content: space-between;
		}
	}

	.warp {
		display: flex;
		align-items: center;
		justify-content: center;
		height: 100%;
		width: 80%;

		.rect {
			background: #FFFFFF;
			box-shadow: 2rpx 6rpx 51rpx 0px rgba(55, 127, 166, 0.3);
			border-radius: 20rpx;

			.notice-header {
				width: 629rpx;
				height: 259rpx;
				background-image: url(@/static/shoping/tipsbg.png);
				background-repeat: no-repeat;
				background-size: 100% 100%;

			}

			.notice-content {
				padding: 30rpx;

				.notice-title {
					font-size: 28rpx;
					color: #357CD4;
					text-align: left;
				}
			}

			.notice-footer {
				padding: 30rpx;

				.noticeBtn {
					background: #1F6ECF;
					box-shadow: 0px 12rpx 16rpx 0px rgba(28, 100, 224, 0.32);
					border-radius: 37rpx;
					font-size: 28rpx;
				}
			}
		}
	}

	.Classification {
		padding: 20rpx 30rpx 0;
		border-radius: 20rpx;
		background-color: white;
		margin-bottom: 20rpx;

		.title {
			font-weight: bold;
		}

		.ClassificationBody {
			margin: 30rpx 0 20rpx 0;

			.active {
				background-color: #ecf5ff !important;
				border-color: #a0cfff !important;
				color: #2979ff !important;
			}
		}
	}

	.itemBtn {
		width: 100%;
		border-radius: 40rpx;
		text-align: center;
		padding: 12rpx;
		font-size: 26rpx;
		box-sizing: border-box;
		clear: both;
		background-color: #F2F2F2;
		margin-bottom: 20rpx;
		border: 1px solid #F2F2F2;
		box-sizing: border-box
	}

	.popupFooter {
		background: white;
		width: 100%;
		height: 50px;
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 20rpx;
		border-top: 1rpx solid #f2f2f2;
	}

	.btnbg {
		background: url(@/static/shoping/btnbg.png);
		background-repeat: no-repeat;
		height: 40px;
		width: 100%;
		background-size: 100% 100%;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.btnbg-item {
		flex: 1;
		text-align: center;
	}

	.productCodeBtn {
		border: 1rpx solid #F2F2F2;
		border-radius: 40rpx;
		padding: 12rpx 24rpx;
		font-size: 28rpx;
	}
</style>
